<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<script src="js/jquery-3.1.1.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
</head>

<style>
	body{
		padding-top:  50px;

	}
	html, body{
		height: 100%;
	}
	.btu-hover:hover {
		background: #66ccff;
	}
</style>
<body >

	
	<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation" style="margin: 0px ; padding: 0px;height: 100% ;padding-top: 50px;width: 200px;" id="accordion">
		<div class="panel" style="border: 0px;">

			<button type="button" class="btn btn-group-justified btu-hover" data-toggle="collapse" data-target="#demo"  data-parent="#accordion" style="border-radius: 0 !important; background: #999">数据展示</button>
			<div id="demo" class="collapse collapseing in" style="color: #999999 ;background: #000 ">
				<button id="ensus" type="button" class="btn btn-default btn-block btn-info btu-hover" style="border-radius: 0 !important;background: #000;border: 0">用户活跃度</button>
				<button type="button" class="btn btn-default btn-block btn-info btu-hover" style="border-radius: 0 !important;background: #000;border: 0">用户升级情况</button>
			</div>
			<button type="button" class="btn btn-group-justified" data-toggle="collapse" data-target="#demo2"  data-parent="#accordion" style="border-radius: 0 !important;background: #999">第二个按钮</button>
			<div id="demo2" class="collapse collapseing" style="color: #999999;background: #000 ">
			<!-- <button type="button" class="btn btn-default btn-block">hhh</button> -->
				<button type="button" class="btn btn-default btn-block btn-info btu-hover" style="border-radius: 0 !important;background: #000;border: 0">敬请期待666</button>
				<button type="button" class="btn btn-default btn-block btn-info" style="border-radius: 0 !important;background: #000;border: 0">敬请期待666</button>
				<button type="button" class="btn btn-default btn-block btn-info" style="border-radius: 0 !important;background: #000;border: 0">敬请期待666</button>
				<button type="button" class="btn btn-default btn-block btn-info" style="border-radius: 0 !important;background: #000;border: 0">敬请期待666</button>
				<button type="button" class="btn btn-default btn-block btn-info" style="border-radius: 0 !important;background: #000;border: 0">敬请期待666</button>
			</div>
		</div>
	</nav>
	<nav class="navbar navbar-inverse navbar-fixed-top " role="navigation">
		<div class="container">
			<div class="navbar-header">
				<a href="#" class="navbar-brand">pro</a>
			</div>
			<div id="navbar" class="collapse navbar-collapse">
				<ul class="nav navbar-nav">
					<li class="active"><a href="">home</a></li>
					<li><a href="">about</a></li>
					<li><a href="">contact</a></li>
				</ul>
			</div>
		</div>
	</nav>
	<div style="padding-left: 200px" id="include">
	</div>
</body>
</html>
<script>
	$(document).ready(function() {
		$('#ensus').click(function(event) {
			// $('#include').html("http://localhost:8080/tbox/table/ensus")
			$('#include').load("http://localhost:8080/tbox/census_obduser.jsp");
		});
	});
</script>